/**
 * 展示试剂的 mmol weight volume
 */
import { FC } from "react";
import { observer, inject } from "mobx-react";
import { Descriptions } from "antd";
import { ITStore } from "../../store";
import { ITFillReagent } from "../../store/interfaces";

type TProp = {
  store: ITStore;
  data: ITFillReagent;
};
const ReagentAmount: FC<TProp | any> = ({
  store,
  data,
}: TProp): JSX.Element => {
  const {
    languageStore: { lang },
  } = store;
  const { mmol, weight, volume } = data;
  return (
    <Descriptions bordered size="small" column={1}>
      {!!mmol && (
        <Descriptions.Item label={lang["langMolaramout"]}>
          {mmol} {lang["langmmol"]}
        </Descriptions.Item>
      )}
      {!!volume && (
        <Descriptions.Item label={lang["langvolume"]}>
          {volume} {lang["langmlunit"]}
        </Descriptions.Item>
      )}
      {!!weight && (
        <Descriptions.Item label={lang["langweight"]}>
          {weight} {lang["langmg"]}
        </Descriptions.Item>
      )}
    </Descriptions>
  );
};

export default inject("store")(observer(ReagentAmount));
